{% extends '@WebsiteBundle/layout/baseblank.html.twig' %}
 {% block content %}
     {{ parent() }}
    <div id="main" class="commonMain">
      <div class="layui-main" style="margin-top: 10px;margin-bottom:40px;">
      <div class="layui-card" style="padding-bottom:30px;margin-top: 30px;">
            <div class="layui-card-header" style="border-bottom:none!important;font-weight: bold;font-size: 22px;">{{  testInfo['name'] }}</div>
                <div class="layui-card-body">
                  <form action="{{ path("qa_test_submit_answer", {"id":testInfo['id']}) }}" method="post" class="ajaxform needs-validation" novalidate>
                      <div class="layui-row layui-col-space10" style="background-color:#f6f6f8">
                            <div class="layui-col-md8 ">
                          <div class="layui-card">
                          {% if testNode %}
                         {% for tk, tv in testNode %}
                            {# 单项选择 #}
                            {% if tk == 0 %}
                            <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">一、单项选择</div>

                             {% for itemk, item in tv %}
                            <div class="layui-card-body qa-choose">
                                <div class="title" id="point_0_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                                <div class="optionList">
                                  <ul>
                                  {% if json_get(item["sub"]["options"], 0) != "" %}
                                    <li><input type="radio" class="ch0" {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "a") }} {% endif %} data-id="{{ item["id"] }}" name="tk-0-{{ item["id"] }}" value="a" >&nbsp;&nbsp;&nbsp;&nbsp;A、{{ json_get(item["sub"]["options"], 0) }}</li> {% endif %}
                                   {% if json_get(item["sub"]["options"], 1) != "" %}
                                    <li><input type="radio" class="ch0" {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "b") }} {% endif %} data-id="{{ item["id"] }}" name="tk-0-{{ item["id"] }}" value="b" >&nbsp;&nbsp;&nbsp;&nbsp;B、{{ json_get(item["sub"]["options"], 1) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 2) != "" %}
                                    <li><input type="radio"  class="ch0" {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "c") }} {% endif %} data-id="{{ item["id"] }}" name="tk-0-{{ item["id"] }}" value="c" >&nbsp;&nbsp;&nbsp;&nbsp;C、{{ json_get(item["sub"]["options"], 2) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 3) != "" %}
                                    <li><input type="radio"  class="ch0" {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "d") }}  {% endif %}  data-id="{{ item["id"] }}" name="tk-0-{{ item["id"] }}" value="d" >&nbsp;&nbsp;&nbsp;&nbsp;D、{{ json_get(item["sub"]["options"], 3) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 4) != "" %}
                                    <li><input type="radio"  class="ch0" {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "e") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-0-{{ item["id"] }}" value="e" >&nbsp;&nbsp;&nbsp;&nbsp;E、{{ json_get(item["sub"]["options"], 4) }}</li>
                                  {% endif %}
                                  </ul>
                                </div>
                            </div>
                              {% endfor %}
                            {% endif %}


                            {# 多选选择 #}
                              {% if tk == 1 %}
                             <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">二、多项选择</div>

                             {% for itemk, item in tv %}
                            <div class="layui-card-body qa-choose">
                                <div class="title"  id="point_1_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                                <div class="optionList">
                                  <ul>
                                  {% if json_get(item["sub"]["options"], 0) != "" %}
                                    <li><input type="checkbox" class="ch" {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "a") }} {% endif %} data-id="{{ item["id"] }}"  name="tk-1-{{ item["id"] }}[]" value="a" >&nbsp;&nbsp;&nbsp;&nbsp;A、{{ json_get(item["sub"]["options"], 0) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 1) != "" %}
                                    <li><input type="checkbox" class="ch" {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "b") }}  {% endif %}  data-id="{{ item["id"] }}" name="tk-1-{{ item["id"] }}[]" value="b" >&nbsp;&nbsp;&nbsp;&nbsp;B、{{ json_get(item["sub"]["options"], 1) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 2) != "" %}
                                    <li><input type="checkbox" class="ch" {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "c") }}  {% endif %}  data-id="{{ item["id"] }}"  name="tk-1-{{ item["id"] }}[]" value="c" >&nbsp;&nbsp;&nbsp;&nbsp;C、{{ json_get(item["sub"]["options"], 2) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 3) != "" %}
                                    <li><input type="checkbox" class="ch" {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "d") }}  {% endif %}  data-id="{{ item["id"] }}"  name="tk-1-{{ item["id"] }}[]" value="d" >&nbsp;&nbsp;&nbsp;&nbsp;D、{{ json_get(item["sub"]["options"], 3) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 4) != "" %}
                                    <li><input type="checkbox" class="ch" {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "e") }}  {% endif %}  data-id="{{ item["id"] }}"  name="tk-1-{{ item["id"] }}[]" value="e" >&nbsp;&nbsp;&nbsp;&nbsp;E、{{ json_get(item["sub"]["options"], 4) }}</li>
                                  {% endif %}
                                  </ul>
                                </div>
                            </div>
                              {% endfor %}
                            {% endif %}

                            {# 不定项选择 #}
                             {% if tk == 2 %}
                             <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">三、不定项选择</div>

                             {% for itemk, item in tv %}
                            <div class="layui-card-body qa-choose">
                                <div class="title"  id="point_2_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                                <div class="optionList">
                                  <ul>
                                  {% if json_get(item["sub"]["options"], 0) != "" %}
                                    <li><input type="checkbox" class="ch"  {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "a") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-2-{{ item["id"] }}[]" value="a" >&nbsp;&nbsp;&nbsp;&nbsp;A、{{ json_get(item["sub"]["options"], 0) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 1) != "" %}
                                    <li><input type="checkbox"  class="ch"  {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "b") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-2-{{ item["id"] }}[]"  value="b" >&nbsp;&nbsp;&nbsp;&nbsp;B、{{ json_get(item["sub"]["options"], 1) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 2) != "" %}
                                    <li><input type="checkbox"  class="ch"  {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "c") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-2-{{ item["id"] }}[]"  value="c" >&nbsp;&nbsp;&nbsp;&nbsp;C、{{ json_get(item["sub"]["options"], 2) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 3) != "" %}
                                    <li><input type="checkbox"  class="ch"  {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "d") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-2-{{ item["id"] }}[]"  value="d" >&nbsp;&nbsp;&nbsp;&nbsp;D、{{ json_get(item["sub"]["options"], 3) }}</li>
                                  {% endif %}
                                   {% if json_get(item["sub"]["options"], 4) != "" %}
                                    <li><input type="checkbox"  class="ch"  {% if item["log"]["answer"] is defined %} {{ inArrayDiff(item["log"]["answer"], "e") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-2-{{ item["id"] }}[]"  value="e" >&nbsp;&nbsp;&nbsp;&nbsp;E、{{ json_get(item["sub"]["options"], 4) }}</li>
                                  {% endif %}
                                  </ul>
                                </div>
                            </div>
                              {% endfor %}
                            {% endif %}

                            {# 判断题 #}
                              {% if tk == 3 %}
                          <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">四、判断题</div>
                            <div class="layui-card-body qa-choose">
                              {% for itemk, item in tv %}
                             <div class="title"  id="point_3_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                              <div class="optionList">
                                  <ul>
                                    <li><input type="radio"  class="ch0"  {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "1") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-3-{{ item["id"] }}" value="1" >&nbsp;&nbsp;&nbsp;&nbsp;√</li>
                                    <li><input type="radio"  class="ch0"  {% if item["log"]["answer"] is defined %} {{ diff(item["log"]["answer"], "0") }}  {% endif %} data-id="{{ item["id"] }}" name="tk-3-{{ item["id"] }}" value="0" >&nbsp;&nbsp;&nbsp;&nbsp;×</li>
                                  </ul>
                                </div>
                              {% endfor %}
                            </div>
                            {% endif %}
                          {# 填空题 #}
                             {% if tk == 4 %}
                          <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">五、填空题</div>
                          <div class="layui-card-body qa-choose">
                              {% for itemk, item in tv %}
                             <div class="title"  id="point_4_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                              <div class="optionList">
                                  <ul>
                                   {% for i in 0..item["sub"]["count"] %}
                                    <li style="padding: 5px 10px;"><input type="text" data-type="{{ item["type"] }}" data-id="{{ item["id"] }}" name="tk-4-{{ item["id"] }}[]" value="{% if item["log"]["answer"] is defined %} {{ json_get(item["log"]["answer"], i) }}  {% endif %} " class="layui-input chkey" ></li>
                                    {% endfor %}
                                  </ul>
                                </div>
                              {% endfor %}
                            </div>
                            {% endif %}


                          {# 问答题 #}
                           {% if tk == 5 %}
                          <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">六、问答题</div>
                            <div class="layui-card-body qa-choose">
                              {% for itemk, item in tv %}
                             <div class="title"  id="point_5_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                             <div class="optionList">
                                  <ul>
                                    <li><textarea  data-id="{{ item["id"] }}"  data-type="{{ item["type"] }}"  name="tk-5-{{ item["id"] }}" class="layui-textarea chkey" >{% if item["log"]["answer"] is defined %} {{ if_get(item["log"]["answer"]) }}  {% endif %} </textarea></li>
                                  </ul>
                                </div>
                              {% endfor %}
                            </div>
                            {% endif %}


                          {# 理解题 #}
                            {% if tk == 6 %}
                          <div class="layui-card-header" style="font-weight: bold;font-size: 18px;">七、理解题</div>
                             <div class="layui-card-body qa-choose">
                              {% for itemk, item in tv %}
                             <div class="title"  id="point_6_{{ itemk+1 }}"><p style="float:left">{{ itemk+1 }}、</p>{{ item["topic"]|raw }}</div>
                              <div class="optionList">
                                  <ul>
                                    <li><textarea data-id="{{ item["id"] }}"  data-type="{{ item["type"] }}"  name="tk-6-{{ item["id"] }}" class="layui-textarea chkey" >{% if item["log"]["answer"] is defined %} {{ if_get(item["log"]["answer"]) }}  {% endif %} </textarea></li>
                                  </ul>
                                </div>
                              {% endfor %}
                            </div>
                            {% endif %}
                          {% endfor %}
                          {% endif %}
            <div class="layui-form-item">
                <div class="layui-input-block">
                  <button class="layui-btn" lay-filter="formDemo">提交</button>
                </div>
            </div>
                      </div>
                  </form>
                </div>
<div class="layui-col-md4">
<div class="layui-card">
  <div class="layui-card-header">答题卡</div>
  <div class="layui-card-body" style="background-color:#f6f6f8">
 {% if testNode %}
  {% for tk, tv in testNode %}
    {# 单项选择 #}
    {% if tk == 0 %}
    <div class="layui-card">
    <div class="layui-card-header">一、单项选择</div>
    <div class="layui-card-body leftcard">
     <ul>
        {% for itemk, item in tv %}
        <li id="li_{{ item["id"] }}"><a href="javascript:;" onclick="toScroll('point_0_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
        {% endfor %}
      </ul>
    </div>
    </div>
    {% endif %}


    {# 多选选择 #}
      {% if tk == 1 %}
       <div class="layui-card clear">
      <div class="layui-card-header">二、多项选择</div>

       <div class="layui-card-body leftcard">
     <ul>
        {% for itemk, item in tv %}
        <li id="li_{{ item["id"] }}"><a  href="javascript:;" onclick="toScroll('point_1_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
        {% endfor %}
      </ul>
    </div>
    </div>
    {% endif %}

    {# 不定项选择 #}
      {% if tk == 2 %}
       <div class="layui-card clear">
      <div class="layui-card-header">三、不定项选择</div>

      <div class="layui-card-body leftcard">
     <ul>
        {% for itemk, item in tv %}
        <li id="li_{{ item["id"] }}"><a  href="javascript:;" onclick="toScroll('point_2_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
        {% endfor %}
      </ul>
    </div>
    </div>
    {% endif %}

    {# 判断题 #}
      {% if tk == 3 %}
       <div class="layui-card clear">
      <div class="layui-card-header">四、判断题</div>
      <div class="layui-card-body leftcard">
      <ul>
          {% for itemk, item in tv %}
          <li id="li_{{ item["id"] }}"><a  href="javascript:;" onclick="toScroll('point_3_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
          {% endfor %}
        </ul>
      </div>
    </div>
    {% endif %}
  {# 填空题 #}
      {% if tk == 4 %}
       <div class="layui-card clear">
        <div class="layui-card-header">五、填空题</div>
        <div class="layui-card-body leftcard">
          <ul>
              {% for itemk, item in tv %}
              <li id="li_{{ item["id"] }}"><a  href="javascript:;" onclick="toScroll('point_4_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
              {% endfor %}
            </ul>
          </div>
      </div>
    {% endif %}


  {# 问答题 #}
    {% if tk == 5 %}
       <div class="layui-card clear">
        <div class="layui-card-header">六、问答题</div>
          <div class="layui-card-body leftcard">
          <ul>
              {% for itemk, item in tv %}
              <li id="li_{{ item["id"] }}"><a  href="javascript:;" onclick="toScroll('point_5_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
              {% endfor %}
            </ul>
          </div>
     </div>
    {% endif %}


  {# 理解题 #}
    {% if tk == 6 %}
    <div class="layui-card clear">
      <div class="layui-card-header">七、理解题</div>
          <div class="layui-card-body leftcard">
        <ul>
            {% for itemk, item in tv %}
            <li id="li_{{ item["id"] }}"><a  href="javascript:;" onclick="toScroll('point_6_{{ itemk+1 }}')">{{ itemk+1 }}</a></li>
            {% endfor %}
          </ul>
        </div>
     </div>
    {% endif %}
  {% endfor %}
  {% endif %}
  </div>
</div>
                            </div>
                      </div>
                </div>
           </div>
      </div>
    </div>
  </div>
 {% endblock %}

{% block body_javascript %}
    {{ parent() }}
<script>
var testId= "{{testInfo["id"]}}"

function toScroll(id){
  document.getElementById(id).scrollIntoView();
}

$(function(){
  //保存答题日志
  function saveAnswerLog(nodeId,answer){
      var data = {"testId":testId, "nodeId":nodeId, "answer":answer};
      var dataStr = JSON.stringify(data);
      var url = "{{ path('qa_test_submit_answer_log') }}"
      $.postJSON(
        url,
        dataStr,
        function (responseText) {
          if (typeof responseText == "string")
            var responseText = $.parseJSON(responseText);
          if (
            responseText._url != "undefined" &&
            !$.isEmptyObject(responseText._url) &&
            !$.isPlainObject(responseText._url)
          ) {
            if (responseText.code !=200) {
              showMsg(responseText.code, responseText.message);
            }
            setTimeout(function () {
            location.assign(responseText._url);
            }, 1000);
          } else {
            if (responseText.code !=200) {
              showMsg(responseText.code, responseText.message);
            }
          }
        },
      );
  }

  $(".ch0").each(function(){
      var that = $(this);
      that.click(function(){
          var id = that.data("id");
          $("#li_"+id).addClass("hasChoose");
          var answer = that.val();
          if(answer){
            saveAnswerLog(id,answer)
          }
      });
  });

  $(".ch").each(function(){
      var that = $(this);
      that.click(function(){
        var answer = "";
        var hasCheck=false;
          that.closest("ul").find("li").children("input").each(function(e){
              if($(this).is(':checked')){
                hasCheck = true;
                answer = answer+","+$(this).val();
              }
          })

        var id = that.data("id");
         if(hasCheck){
              $("#li_"+id).addClass("hasChoose");
         }else{
              $("#li_"+id).removeClass("hasChoose");
         }

          if(answer){
            saveAnswerLog(id,answer)
          }

      });
  });

  $(".chkey").each(function(){
     var that = $(this);
      that.keyup(function(){
          var vl = that.val();
          var id = that.data("id");
          var type = that.data("type");
         if(vl){
            $("#li_"+id).addClass("hasChoose");
         }else{
            $("#li_"+id).removeClass("hasChoose");
         }
         var answer = that.val();
          if(type == 4){
              answer = {};
              $("input[data-id='"+id+"']").each(function(i){
                    answer[i] = $(this).val();
              });
              answer = JSON.stringify(answer);
          }
          if(answer){
            saveAnswerLog(id,answer)
          }
      });
  });

})
</script>
{% endblock %}
